import {Form, Button, Input, Row, Col, Cascader, DatePicker,InputNumber,Radio, Select } from 'antd';
import moment from 'moment';
import styles from './index.less';
const FormItem = Form.Item;

function query({form, onOk }){

  const {getFieldDecorator,getFieldsValue,resetFields} = form;
  const { MonthPicker, RangePicker } = DatePicker;
  const formItemLayout = {
    // labelCol: { span: 7 },
    wrapperCol: { span: 20 },
    colon:false,
  };
  const submit = () => {
    const values = getFieldsValue();
      values.isServing= values.isServing && values.isServing[0],
    onOk(values);

  };

  const handleChange = (key, values) => {
    let fields = getFieldsValue()
    fields[key] = values
    fields = handleFields(fields)
    onFilterChange(fields)
  }

  const reset = () => {
    resetFields();
  }
  return(

    <Form
      onSubmit={submit}
    >
      <Row>
        <Col span={6}>
          <FormItem
            {...formItemLayout}
          >
            {
              getFieldDecorator('customerName',)(
                <Input size='large' placeholder='客户中文名称'/>
              )
            }
          </FormItem>
        </Col>
        <Col span={6}>
          <FormItem
            {...formItemLayout}
          >
            {
              getFieldDecorator('customerNum',)(
                <Input size='large' placeholder='客户编号'/>
              )
            }
          </FormItem>
        </Col>
        <Col span={6}>
          <FormItem
            {...formItemLayout}
          >
            {
              getFieldDecorator('customerEname', )(
                <Input size='large'  placeholder='客户英文名字'/>
              )
            }
          </FormItem>
        </Col>
        <Col span={6}>
          <FormItem
            {...formItemLayout}
          >
            {
              getFieldDecorator('customerAbbreviation',)(
                <Input size='large' placeholder='客户简称'/>
              )
            }
          </FormItem>
        </Col>
      </Row>
      <Row>
        <Col span={6}>
          <FormItem
            {...formItemLayout}
          >
            {
              getFieldDecorator('customerProperty',)(

                       <Select placeholder='客户性质'>
                         <Select.Option value='1'>企业</Select.Option>
                         <Select.Option value='2'>代表处</Select.Option>
                         <Select.Option value='3'>无机构</Select.Option>
                       </Select>

              )
            }
          </FormItem>
        </Col>
        <Col span={6}>
          <FormItem
            {...formItemLayout}
          >
            {
              getFieldDecorator('customerType',)(


                      <Select placeholder='客户类型'>
                        <Select.Option value='1'>国家</Select.Option>
                        <Select.Option value='2'>集体</Select.Option>
                        <Select.Option value='3'>民营</Select.Option>
                        <Select.Option value='4'>外资</Select.Option>
                        <Select.Option value='5'>侨资</Select.Option>
                        <Select.Option value='6'>合资</Select.Option>
                        <Select.Option value='7'>中资</Select.Option>
                        <Select.Option value='8'>其他</Select.Option>
                      </Select>

              )
            }
          </FormItem>
        </Col>
        <Col span={6}>
          <FormItem
            {...formItemLayout}
          >
            {
              getFieldDecorator('industryCategory', )(

                       <Select placeholder='行业类别'>
                         <Select.Option value='1'>房地产/建筑/物业/装饰房屋中介</Select.Option>
                         <Select.Option value='2'>金融/保险/证券/投资</Select.Option>
                         <Select.Option value='3'>医疗医药</Select.Option>
                         <Select.Option value='4'>物流运输</Select.Option>
                         <Select.Option value='5'>工厂制造业</Select.Option>
                         <Select.Option value='6'>汽车自动化</Select.Option>
                         <Select.Option value='7'>化工与能源</Select.Option>
                         <Select.Option value='8'>百货/连锁</Select.Option>
                         <Select.Option value='9'>快销/耐销</Select.Option>
                         <Select.Option value='10'>广告/多媒体</Select.Option>
                         <Select.Option value='11'>服务/教育/培训</Select.Option>
                         <Select.Option value='12'>其他</Select.Option>
                       </Select>

              )
            }
          </FormItem>
        </Col>
        <Col span={6}>
          <FormItem
            {...formItemLayout}
          >
            {
              getFieldDecorator('isServing', )(

                     <Select placeholder='在服状态'>
                       <Select.Option value='1'>在服</Select.Option>
                       <Select.Option value='0'>停服</Select.Option>
                     </Select>
              )
            }
          </FormItem>
        </Col>
      </Row>
      <Row>
        <Col span={24} style={{ textAlign: 'right'}}>
          <Button type='primary' icon='search' onClick={ submit } style={{ marginRight: 20 }}>查 询</Button>
          <Button onClick={reset} style={{ marginRight: 20 }}>清 除</Button>
        </Col>
      </Row>
    </Form>

  )
}

export default Form.create()(query);
